/* *****************************************************

    ** Custom Stylesheet **
    ** WHMCS Template Personalizzato - Max Valle **

***************************************************** */

/* =====================================================
   1. FONT E TIPOGRAFIA BASE
   ===================================================== */

body,
p,
span,
div,
li,
td,
th,
label,
input,
textarea,
select,
.panel-body,
.well,
.card-body {
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: #2c2c2c !important;
}

/* Titoli */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.panel-title,
.card-title,
.page-title,
.product-title,
.header-lined {
    font-family: Verdana, Geneva, sans-serif !important;
    color: #0066CC !important;
}

/* =====================================================
   2. LINK
   ===================================================== */

a {
    color: #0066CC;
}

a:hover {
    color: #0052a3;
}

/* =====================================================
   3. PULSANTI
   ===================================================== */

.btn {
    font-family: Verdana, Geneva, sans-serif !important;
}

/* Pulsanti primari */
.btn-primary {
    background-color: #3B82F6 !important;
    border-color: #3B82F6 !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #2563EB !important;
    border-color: #2563EB !important;
}

/* Pulsante Success (Acquista/Ordina) */
.btn-success {
    color: #FFFFFF !important;
    background-color: #FF6B00 !important;
    border-color: #2c2c2c !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

.btn-success.active,
.btn-success:active,
.open>.dropdown-toggle.btn-success {
    color: #FFFFFF !important;
    background-color: #FF6B00 !important;
    background-image: none;
    border-color: #2c2c2c !important;
}

.btn-success:hover {
    color: #FFFFFF !important;
    background-color: #FF8C00 !important;
    border-color: #2c2c2c !important;
}

/* =====================================================
   4. HEADER E NAVBAR
   ===================================================== */

.navbar-default,
.primary-bg-color {
    background-color: #3B82F6 !important;
}

/* Pulsante Visualizza Carrello header */
li.primary-action a.btn[href="/cart.php?a=view"] {
    background-color: #CCFF00 !important;
    color: #2c2c2c !important;
    border-radius: 4px !important;
    border-color: #2c2c2c !important;
}

li.primary-action a.btn[href="/cart.php?a=view"]:hover {
    background-color: #80FF00 !important;
    color: #2c2c2c !important;
}

/* =====================================================
   5. BADGE, LABEL E PROGRESS
   ===================================================== */

.badge-primary,
.label-primary {
    background-color: #3B82F6 !important;
}

.progress-bar {
    background-color: #3B82F6;
}

.panel-primary > .panel-heading {
    background-color: #3B82F6;
    border-color: #3B82F6;
}

.border-primary {
    border-color: #3B82F6 !important;
}

/* =====================================================
   6. FOOTER
   ===================================================== */

#footer {
    background-color: #000000 !important;
}

#footer .container,
#footer .container * {
    color: #ffffff !important;
}

#footer a:hover {
    color: #cccccc !important;
}

/* =====================================================
   7. SIDEBAR MENU
   ===================================================== */

/* Sfondo titolo menu laterale */
.panel-sidebar > .panel-heading {
    color: #333;
    background-color: #F7FAFC !important;
    border-bottom: 0;
}

/* Voci menu */
a.list-group-item,
button.list-group-item {
    color: #1c1c1c;
}

/* Menu item attivo */
.panel-sidebar a.list-group-item.active,
.panel-sidebar a.list-group-item.active:focus,
.panel-sidebar a.list-group-item.active:hover {
    background-color: #FFFF00 !important;
    color: #2c2c2c !important;
    border-color: #B7B70A !important;
}

/* Hover voci menu */
.list-group-item.list-group-item-action:hover {
    background-color: #FFFF00c9 !important;
}

/* =====================================================
   8. PAGINA PRODOTTI - LAYOUT
   ===================================================== */

/* Prodotti su colonna singola */
.products .row > div,
.product-group .col-md-6,
.product-group .col-lg-6,
.product-group .col-sm-6,
.products .col-md-6,
.products .col-lg-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Wrapper prodotto */
.product-wrapper {
    width: 100% !important;
    margin-bottom: 30px !important;
}

.product-wrapper .product {
    width: 100% !important;
    max-width: 100% !important;
    padding: 25px !important;
    background: #ffffff !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

/* Sfondo intestazione prodotto */
#order-standard_cart .products .product header {
    position: relative;
    padding: 10px 20px;
    margin: 0 1px;
    background: #F7FAFC !important;
    border-radius: 3px 3px 0 0;
}

/* Titolo prodotto */
#order-standard_cart .products .product-wrapper .product header span,
#order-standard_cart .product-wrapper .product header span,
.product-wrapper .product header span,
div.product-wrapper div.product header span {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #0066CC !important;
    text-transform: uppercase !important;
    margin: 0 0 15px 0 !important;
    display: block !important;
}

/* =====================================================
   9. PAGINA PRODOTTI - DESCRIZIONE (ESCLUSO FEATURES BOX)
   ===================================================== */

.product-desc-full {
    width: 100% !important;
    padding: 15px 0 !important;
    line-height: 1.8 !important;
}

.product-desc-full p {
    margin-bottom: 15px !important;
    color: #2c2c2c !important;
}

/* IMPORTANTE: Escludi .features-list dalle regole generiche */
.product-desc-full > ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

.product-desc-full > ul > li {
    position: relative !important;
    padding-left: 28px !important;
    margin-bottom: 10px !important;
    color: #2c2c2c !important;
}

.product-desc-full > ul > li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0 !important;
    color: #10B981 !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.product-desc-full .feature-value {
    font-weight: 600 !important;
    color: #0066CC !important;
    margin-right: 5px !important;
}

/* =====================================================
   10. PAGINA PRODOTTI - DIVISORE
   ===================================================== */

.product-divider {
    width: 100% !important;
    height: 1px !important;
    background-color: #E5E7EB !important;
    margin: 20px 0 !important;
}

/* =====================================================
   11. PAGINA PRODOTTI - FOOTER (PREZZO E PULSANTE)
   ===================================================== */

.product-footer-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    padding-top: 15px !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}

/* Prezzo a sinistra */
.product-pricing-left {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.product-pricing-left .price-label {
    font-size: 16px !important;
    color: #2c2c2c !important;
    font-weight: 400 !important;
}

.product-pricing-left .price {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #0066CC !important;
}

.product-pricing-left .price-cycle {
    font-size: 14px !important;
    color: #64748B !important;
}

.product-pricing-left .starting-from {
    font-size: 13px !important;
    color: #64748B !important;
}

.product-pricing-left .setup-fee {
    font-size: 12px !important;
    color: #64748B !important;
    display: block !important;
    width: 100% !important;
}

/* +iva dopo il prezzo */
.price-iva {
    font-size: 16px !important;
    font-weight: 400 !important;
    color: #2c2c2c !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
}

/* Pulsante Ordina a destra */
.product-btn-right {
    flex-shrink: 0 !important;
}

.product-btn-right .btn-order-now {
    background-color: #FF6D00 !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 12px 28px !important;
    font-size: 14px !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease !important;
    letter-spacing: 0.5px !important;
}

.product-btn-right .btn-order-now:hover {
    background-color: #FF9100 !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
    transform: none !important;
}

/* =====================================================
   12. CARRELLO - HEADER TABELLA
   ===================================================== */

/* CARRELLO - TABELLA PRODOTTI con bordo completo */
.view-cart-items-header {
    background-color: #EAF4DF !important;
    color: #0066CC !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 10px 20px !important;
    border-radius: 8px 8px 0 0 !important;
    margin-bottom: 0 !important;
    border: 1px solid #0066CC !important;
    border-bottom: none !important;
}

.view-cart-items {
    border: 1px solid #0066CC !important;
    border-radius: 0 0 8px 8px !important;
}

/* Righe alternate */
.view-cart-items .item:nth-child(odd) {
    background-color: #FFFFFF !important;
}

.view-cart-items .item:nth-child(even) {
    background-color: #F7FAFC !important;
}

/* Padding righe */
.view-cart-items .item {
    padding: 15px 20px !important;
    border-bottom: 1px solid #E5E7EB !important;
}

.view-cart-items .item:last-child {
    border-bottom: none !important;
    border-radius: 0 0 8px 8px !important;
}

/* =====================================================
   13. CARRELLO - PULSANTE SVUOTA
   ===================================================== */
.empty-cart {
    margin-top: 25px !important;
    padding-top: 20px !important;
    border-top: 1px solid #E5E7EB !important;
    color: #FFFFFF !important;
}

.empty-cart #btnEmptyCart,
.empty-cart .btn-link {
    background-color: #DC2626 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 8px 15px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
}

/* =====================================================
   14. CARRELLO - BOX RIEPILOGO ORDINE
   ===================================================== */

.order-summary {
    background-color: #EBF5FF !important;
    border: 1px solid #0066CC !important;
    border-radius: 8px !important;
    padding: 20px !important;
}

/* Titolo Riepilogo Ordine */
.order-summary::before {
    display: block !important;
    background-color: #F7FAFC !important;
    color: #0066CC !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 10px 20px !important;
    border-radius: 3px 3px 0 0 !important;
    margin: -20px -20px 15px -20px !important;
}

/* Testi interni riepilogo */
.order-summary .subtotal,
.order-summary .recurring-totals,
.order-summary .total-due-today,
.order-summary .clearfix span {
    color: #2c2c2c !important;
}

/* Prezzi in blu */
.order-summary .amt,
.order-summary .cost,
.order-summary #subtotal,
.order-summary #totalDueToday {
    color: #0066CC !important;
    font-weight: 700 !important;
}

/* Loader */
.order-summary .loader,
#orderSummaryLoader {
    background-color: #EBF5FF !important;
}

.order-summary .loader i,
#orderSummaryLoader i {
    color: #0066CC !important;
}

/* =====================================================
   15. CARRELLO - PULSANTE CHECKOUT
   ===================================================== */

.order-summary .btn-checkout,
.order-summary a[href*="checkout"],
.order-summary .btn-success.btn-lg {
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 12px 25px !important;
    font-size: 14px !important;
    color: #FFFFFF !important;
    background-color: #FF6B00 !important;
    white-space: nowrap !important;
    margin: 10px 0 !important;
}

.order-summary .btn-checkout:hover,
.order-summary a[href*="checkout"]:hover,
.order-summary .btn-success.btn-lg:hover {
    color: #FFFFFF !important;
    background-color: #FF8C00 !important;
}

.order-summary .btn-checkout i,
.order-summary .btn-success i {
    color: #FFFFFF !important;
}

/* Container pulsanti */
.order-summary .text-right {
    text-align: right !important;
}

/* Link Continua lo Shopping */
.order-summary a.btn-continue-shopping {
    color: #0066CC !important;
    font-size: 13px !important;
    background-color: transparent !important;
}

/* =====================================================
   16. RESPONSIVE - MOBILE
   ===================================================== */

@media (max-width: 576px) {
    .product-footer-row {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    
    .product-btn-right {
        width: 100% !important;
        margin-top: 15px !important;
    }
    
    .product-btn-right .btn-order-now {
        width: 100% !important;
        text-align: center !important;
    }
}

/* Nascondi sidebar su mobile */
@media screen and (max-width: 991px) {
    html body #order-standard_cart div.cart-sidebar.sidebar {
        display: none !important;
    }
}

/* =====================================================
   17. FIX CONFLITTI - ALTA SPECIFICITA
   ===================================================== */

/* Header tabella carrello - forza colore e peso */
#order-standard_cart .view-cart-items-header,
#order-standard_cart .view-cart-items-header div,
#order-standard_cart .view-cart-items-header .row,
#order-standard_cart .view-cart-items-header .row div,
#order-standard_cart .view-cart-items-header [class*="col-"],
.view-cart-items-header div[class*="col-"] {
    color: #0066CC !important;
    font-weight: 700 !important;
}

/* Pulsante Svuota Carrello - forza bianco */
#order-standard_cart .empty-cart #btnEmptyCart,
#order-standard_cart .empty-cart #btnEmptyCart span,
#order-standard_cart .empty-cart #btnEmptyCart i,
#order-standard_cart .empty-cart .btn-link,
#order-standard_cart .empty-cart .btn-link span,
#order-standard_cart .empty-cart .btn-link i,
.empty-cart button#btnEmptyCart span,
.empty-cart button#btnEmptyCart i {
    color: #FFFFFF !important;
}

/* =====================================================
   18. PAGINA CHECKOUT
   ===================================================== */

/* Titoli sezioni checkout - rimuovi sfondo blu */
#order-standard_cart .sub-heading span.primary-bg-color,
.sub-heading span.primary-bg-color {
    background: none !important;
    background-color: transparent !important;
    color: #0066CC !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
    padding: 0 !important;
    border: none !important;
}

#order-standard_cart .sub-heading,
.sub-heading {
    margin-top: 35px !important;
    margin-bottom: 25px !important;
    padding: 0 0 12px 0 !important;
    border: none !important;
    border-bottom: 2px solid #0066CC !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Rimuovi pseudo-elementi */
#order-standard_cart .sub-heading::before,
#order-standard_cart .sub-heading::after,
.sub-heading::before,
.sub-heading::after {
    display: none !important;
    content: none !important;
}

/* Fix scritta campi obbligatori */
#containerNewUserSignup > div:nth-child(6),
#containerNewUserSignup small,
#containerNewUserSignup span > i > small {
    display: block !important;
    margin-top: 0px !important;
    margin-bottom: 45px !important;
    clear: both !important;
    position: relative !important;
}

/* Pulsanti Checkout */
#order-standard_cart #btnCompleteOrder,
#order-standard_cart button[type="submit"].btn-success,
#order-standard_cart .btn-complete-order {
    background-color: #FF6B00 !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    padding: 14px 30px !important;
    font-size: 15px !important;
}

#order-standard_cart #btnCompleteOrder:hover,
#order-standard_cart button[type="submit"].btn-success:hover,
#order-standard_cart .btn-complete-order:hover {
    background-color: #FF8C00 !important;
    color: #FFFFFF !important;
}

#order-standard_cart .btn-default,
#order-standard_cart .btn-secondary {
    background-color: #FFFFFF !important;
    color: #0066CC !important;
    border: 1px solid #0066CC !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    padding: 10px 20px !important;
}

#order-standard_cart .btn-default:hover,
#order-standard_cart .btn-secondary:hover {
    background-color: #EBF5FF !important;
    color: #0066CC !important;
}

#order-standard_cart .btn-info {
    background-color: #FFFF00 !important;
    color: #2c2c2c !important;
    border: 1px solid #B7B70A !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

#order-standard_cart .btn-info:hover {
    background-color: #E6E600 !important;
    color: #2c2c2c !important;
}

.btn-info {
    color: #2c2c2c;
    background-color: #FFFF00;
    border-color: #B7B70A;
}

#order-standard_cart .form-control.with-icon,
#order-standard_cart .input-group .form-control {
    padding-left: 40px !important;
}

/* =====================================================
   20. PRODUCT FEATURES BOX - DESCRIZIONE PRODOTTO
   ===================================================== */

.product-features-container {
    margin: 10px 0 !important;
    width: 100% !important;
}

.product-image-box {
    text-align: center !important;
    margin-bottom: 15px !important;
}

.product-thumbnail {
    width: 300px !important;
    height: 300px !important;
    object-fit: cover !important;
    border: 3px solid #E2E8F0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08) !important;
}

.product-features-box {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
}

.features-section {
    background-color: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 6px !important;
    padding: 6px 10px !important;
    width: 100% !important;
    min-width: 0 !important;
}

.features-title {
    color: #0066CC !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin: 0 0 2px 0 !important;
    padding: 0 0 2px 0 !important;
    border-bottom: 1px solid #0066CC !important;
}

.features-title i {
    margin-right: 6px !important;
    color: #0066CC !important;
}

.features-list {
    list-style: none !important;
    padding: 2px 0 0 0 !important;
    margin: 0 !important;
}

.features-list li {
    display: inline !important;
    font-size: 12px !important;
    color: #2c2c2c !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.features-list li::before {
    content: "✓ " !important;
    color: #10B981 !important;
    font-weight: bold !important;
    font-size: 10px !important;
}

.features-list li::after {
    content: " • " !important;
    color: #CBD5E1 !important;
}

.features-list li:last-child::after {
    content: "" !important;
}

.features-list li strong {
    color: #0066CC !important;
    font-weight: 700 !important;
}

/* Mobile */
@media (max-width: 768px) {
    .product-features-box {
        grid-template-columns: 1fr !important;
    }
    
    .product-thumbnail {
        width: 250px !important;
        height: 250px !important;
    }
    
    .features-section {
        padding: 10px 12px !important;
    }
    
    .features-title {
        font-size: 18px !important;
        margin: 0 0 5px 0 !important;
        padding: 0 0 5px 0 !important;
    }
    
    .features-list li {
        display: block !important;
        font-size: 16px !important;
        line-height: 16px !important;
        margin-bottom: 2px !important;
        padding-left: 20px !important;
        position: relative !important;
    }
    
    .features-list li::before {
        position: absolute !important;
        left: 0 !important;
        font-size: 16px !important;
    }
    
    .features-list li::after {
        content: "" !important;
    }
}